<template>
  <div class="wrap staff">
    <div class="worker">
      <ul>
        <li v-for="item in staffList" :key="item.id">
          <p>
            <span>
              <i class="iconfont icon-hrrenshirenshiguanli380"></i>
              {{ item.staff_name }}
            </span>
            联系电话：{{ item.staff_tel }}
          </p>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { getallStaffList } from "../api/api";
export default {
  // 定义属性
  name: "Staff",
  data() {
    return {
      staffList: [],
    };
  },
  methods: {
    getList() {
      getallStaffList({
        staff_name: this.staff_name,
        staff_tel: this.tel,
      }).then((res) => {
        console.log(res);
        this.staffList = res.data;
      });
    },
  },
  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {
    this.getList();
  },
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
};
</script>

<style lang='scss' scoped>
.staff {
  .worker {
    padding: 0 16px;
    li {
      padding: 20px 0;
      margin-bottom: 8px;
      border-radius: 6px;
      box-shadow: 0px 0px 30px #eaeaea;
      p {
        font-size: 14px;
        color: #646566;
        padding: 0 10px;
      }
    }
  }
}
</style>